<template>
    <div id="dr17">
        <Breadcrumb style="margin-bottom: 10px">
            <BreadcrumbItem to="/superAdmin">首页</BreadcrumbItem>
            <BreadcrumbItem>实名认证管理</BreadcrumbItem>
            <BreadcrumbItem>认证审核</BreadcrumbItem>
        </Breadcrumb>
        <Select v-model="attestationType" style="width:200px;">
            <Option v-for="item in attestationList" :value="item.value" :key="item.value">{{ item.label }}</Option>
        </Select> &nbsp;
        <Select v-model="type" style="width:200px;">
            <Option v-for="item in typeList" :value="item.value" :key="item.value">{{ item.label }}</Option>
        </Select> &nbsp;
        <Input v-model="selectMobile" placeholder="查询手机号码" style="width: 150px"/>
        &nbsp;
        <Button type="info" @click="search()">查询</Button>
        <div>
            <Table style="margin-top: 10px" :maxWidth="1000" :minWidth="10" stripe :columns="columns"
                   @on-row-dblclick="rowData" :data="data"
                   v-if="data&&data.length>0"></Table>
            <Page :total="pageTotal" :current="curPage" @on-change="pageChange"
                  style="display: inline-block;padding-top: 10px;padding-bottom: 10px" show-elevator v-if="data&&data.length>0"></Page>
            <div style="padding-left: 10px;position:relative ;display: inline-block;height: 52px;line-height: 52px;top: -12px"> 总计 {{pageTotal}} 条数据</div>

        </div>
        <div id="loading" v-if="loading">
            <div class="spinner">
                <div class="double-bounce1"></div>
                <div class="double-bounce2"></div>
            </div>
        </div>

        <Modal v-model="driverBool" fullscreen>
            <div style="text-align:left;font-size: 16px">

                <div style="margin: 3px">姓名:&nbsp;<span>{{modeData.realName}}</span></div>
                <div style="margin: 3px">身份证号码:&nbsp;<span>{{modeData.cardNum}}</span></div>
                <div style="margin: 3px">身份证照片:</div>
                <div style="margin: 3px"><img :src="modeData.cardPhoto1" v-if="modeData.cardPhoto1" alt=""
                                              style="margin: 5px" width="360px">
                    <img :src="modeData.cardPhoto2" alt="" v-if="modeData.cardPhoto2" style="margin: 5px" width="360px">
                </div>
                <div style="margin: 3px">准驾车型:&nbsp;<span>{{modeData.driverCarType}}</span></div>
                <div style="margin: 3px">档案编号:&nbsp;<span>{{modeData.fileNumber}}</span></div>
                <div style="margin: 3px">驾驶证照片:</div>
                <div style="margin: 3px"><img :src="modeData.driveCardPhoto1" v-if="modeData.driveCardPhoto1" alt=""
                                              style="margin: 5px" width="360px">
                    <img :src="modeData.driveCardPhoto2" alt="" v-if="modeData.driveCardPhoto2" style="margin: 5px"
                         width="360px"></div>
            </div>
            <div slot="footer">
                <Button type="info" @click="attestationSuccess()">认证通过</Button>
                <Button type="info" @click="fail=true">认证失败</Button>
            </div>
        </Modal>

        <Modal v-model="sellerBool" fullscreen>
            <div style="text-align:left;font-size: 16px">

                <div style="margin: 3px">姓名:&nbsp;<span>{{modeData.realName}}</span></div>
                <div style="margin: 3px">身份证号码:&nbsp;<span>{{modeData.cardNum}}</span></div>
                <div style="margin: 3px">身份证照片:</div>
                <div style="margin: 3px"><img :src="modeData.cardPhoto1" v-if="modeData.cardPhoto1" alt=""
                                              style="margin: 5px" width="360px">
                    <img :src="modeData.cardPhoto2" alt="" v-if="modeData.cardPhoto2" style="margin: 5px" width="360px">
                </div>
            </div>
            <div slot="footer">
                <Button type="info" @click=" attestationSuccess()">认证通过</Button>
                <Button type="info" @click="fail=true">认证失败</Button>
            </div>
        </Modal>

        <Modal v-model="fail">
            <p slot="header" style="color:#444;text-align:center">
                <span>选择失败原因</span>
            </p>
            <div style="text-align:left;font-size: 16px;">
                <Checkbox v-model="a1">证件上传不正确，请上传正确的证件照片!</Checkbox>
                <br>
                <Checkbox v-model="a2">身份证与驾驶证号码不一致!</Checkbox>
                <br>
                <Checkbox v-model="a3">对不起你的身份审核未通过，请正确上传有效身份证的正反面及驾驶证的正副本!</Checkbox>
                <br>
                <Checkbox v-model="a4">你的身份证正面照片不清晰!</Checkbox>
                <br>
                <Checkbox v-model="a5">你的身份证反面照片不清晰!</Checkbox>
                <br>
                <Checkbox v-model="a6">你的驾驶证正本照片不清晰!</Checkbox>
                <br>
                <Checkbox v-model="a7">你的驾驶证副本照片不清晰!</Checkbox>
                <br>
                <Checkbox v-model="a8">你的身份证已过期!</Checkbox>
                <br>
            </div>
            <div slot="footer">
                <Button type="info" @click="fail=false">取消</Button>
                <Button type="info" @click="attestationFail()">确认</Button>
            </div>
        </Modal>

        <Modal v-model="failErr">
            <p slot="header" style="color:#444;text-align:center">
                <span>失败原因</span>
            </p>
            <div style="text-align:left;font-size: 16px;">
                {{failErrStr}}
            </div>
            <div slot="footer">
                <Button type="info" @click="failErr=false">确认</Button>
            </div>
        </Modal>

    </div>
</template>
<script type="text/ecmascript-6">
    import sessionUtils from '../../model/sessionUtils';
    import ipServer from '../../model/ip';
    import Axios from 'axios';
    export default{
        data(){
            return {
                a1: false,
                a2: false,
                a3: false,
                a4: false,
                a5: false,
                a6: false,
                a7: false,
                a8: false,
                type: "1",
                attestationType: "1",
                selectMobile: "",
                reffer: "",
                endTime: "",
                startTime: "",
                fail: false,
                failErr: false,
                failErrStr: "",
                attestationList: [
                    {
                        value: '1',
                        label: '待认证'
                    },
                    {
                        value: '2',
                        label: '认证失败'
                    },
                    {
                        value: '3',
                        label: '认证成功'
                    }],
                typeList: [
                    {
                        value: '1',
                        label: '司机'
                    },
                    {
                        value: '2',
                        label: '配件商'
                    },
                    {
                        value: '3',
                        label: '修理'
                    },
                    {
                        value: '4',
                        label: '补胎'
                    },
                    {
                        value: '5',
                        label: '审车'
                    },
                    {
                        value: '6',
                        label: '加油'
                    },
                    {
                        value: '7',
                        label: '吊车'
                    }
                ],
                loading: false,
                modeData: {},
                driverBool: false,
                sellerBool: false,
                pageTotal: 0,
                curPage: 0,
                columns: [{
                    title: '用户类型',
                    key: 'type1',
                    width: 100
                },
                    {
                        title: '提交时间',
                        key: 'valildTime1',
                        width: 155
                    },
                    {
                        title: '手机号',
                        key: 'mobile',
                        width: 120
                    }, {
                        title: '真实姓名',
                        key: 'realName',
                    },
                    {
                        title: '身份证号码',
                        key: 'cardNum',
                        width: 200
                    },
                    {
                        title: '是否认证',
                        key: 'validStatus1',
                        width: 100
                    },
                    {
                        title: '用户状态',
                        key: 'status1',
                        width: 100
                    }
                ],
                data: []
            }
        },
        mounted(){
            this.getData();
        },
        methods: {
            pageChange(page){
                this.getData(page);
            },
            rowData(data, index){
                this.modeData = data;
                this.modeData.num = index;
                if (this.modeData.validStatus == 1) {
                    if (data.type == 1)
                        this.driverBool = true;
                    else
                        this.sellerBool = true;
                }
                if (this.modeData.validStatus == 2) {

                    this.getErr();
                }
            }, attestationFail(){
                var param = new URLSearchParams();
                param.append('mobile', sessionUtils.getSession("mobile"));
                param.append('token', sessionUtils.getSession("token"));
                param.append('userId', this.modeData._id);
                param.append('userType', this.modeData.type);
                var msg = "";
                if (this.a1) {
                    msg += "证件上传不正确，请上传正确的证件照片 ";
                }
                if (this.a2) {
                    msg += "身份证与驾驶证号码不一致 ";
                }
                if (this.a3) {
                    msg += "对不起你的身份审核未通过，请正确上传有效身份证的正反面及驾驶证的正副本 ";
                }
                if (this.a4) {
                    msg += "你的身份证正面照片不清晰 ";
                }
                if (this.a5) {
                    msg += "你的身份证反面照片不清晰 ";
                }
                if (this.a6) {
                    msg += "你的驾驶证正本照片不清晰 ";
                }
                if (this.a7) {
                    msg += "你的驾驶证副本照片不清晰 ";
                }
                if (this.a8) {
                    msg += "你的身份证已过期 ";
                }

                if (!msg || msg.length <= 0) {
                    this.$Message.info("请选择失败原因!");
                    return;
                }

                param.append('validStatus', "2");
                param.append('reason', msg);
                this.loading = true;
                Axios.post(ipServer + "user/updateValidStatus", param)
                        .then(res => {
                            if (res.data.code == 0) {
                                sessionUtils.setSession("token", res.data.token);
                                this.driverBool = false;
                                this.sellerBool = false;
                                this.fail = false;
                                this.data.splice(this.modeData.num, 1);
                                this.modeData = {};
                            } else if (res.data.code == 3) {
                                sessionUtils.clear();
                                this.$router.push("/login");
                                this.$Message.info(res.data.msg);
                            } else {
                                this.$Message.info(res.data.msg);
                            }
                            this.loading = false;
                        })
                        .catch(err=> {
                            this.loading = false;
                            this.$Message.info(err);
                        });
            },
            getErr(){
                var param = new URLSearchParams();
                param.append('mobile', sessionUtils.getSession("mobile"));
                param.append('token', sessionUtils.getSession("token"));
                param.append('userId', this.modeData._id);
                this.loading = true;
                Axios.post(ipServer + "user/selectValidStatusFailInfos", param)
                        .then(res => {
                            if (res.data.code == 0) {
                                sessionUtils.setSession("token", res.data.token);
                                this.failErr = true;
                                this.failErrStr = res.data.data.reason;
                            } else if (res.data.code == 3) {
                                sessionUtils.clear();
                                this.$router.push("/login");
                                this.$Message.info(res.data.msg);
                            } else {
                                this.$Message.info(res.data.msg);
                            }
                            this.loading = false;
                        })
                        .catch(err=> {
                            this.loading = false;
                            this.$Message.info(JSON.stringify(err));
                        });
            },
            attestationSuccess(){
                var param = new URLSearchParams();
                param.append('mobile', sessionUtils.getSession("mobile"));
                param.append('token', sessionUtils.getSession("token"));
                param.append('userId', this.modeData._id);
                param.append('userType', this.modeData.type);
                param.append('validStatus', "3");
                this.loading = true;
                Axios.post(ipServer + "user/updateValidStatus", param)
                        .then(res => {
                            if (res.data.code == 0) {
                                sessionUtils.setSession("token", res.data.token);
                                this.$Message.info("通过成功!");
                                this.driverBool = false;
                                this.sellerBool = false;
                                this.data.splice(this.modeData.num, 1);
                                this.modeData = {};
                            } else if (res.data.code == 3) {
                                sessionUtils.clear();
                                this.$router.push("/login");
                                this.$Message.info(res.data.msg);
                            } else {
                                this.$Message.info(res.data.msg);
                            }
                            this.loading = false;
                        })
                        .catch(err=> {
                            this.loading = false;
                            this.$Message.info(err);
                        });
            },
            delData(data){
                var param = new URLSearchParams();
                param.append('mobile', sessionUtils.getSession("mobile"));
                param.append('token', sessionUtils.getSession("token"));
                param.append('userId', data.row._id);
                param.append('userType', data.row.type);
                this.loading = true;
                Axios.post(ipServer + "user/deleteUserById", param)
                        .then(res => {
                            if (res.data.code == 0) {
                                sessionUtils.setSession("token", res.data.token);
                                this.data.splice(data.index, 1);
                                this.$Message.info("删除成功!");
                            } else if (res.data.code == 3) {
                                sessionUtils.clear();
                                this.$router.push("/login");
                                this.$Message.info(res.data.msg);
                            } else {
                                this.$Message.info(res.data.msg);
                            }
                            this.loading = false;
                        })
                        .catch(err=> {
                            this.loading = false;
                            this.$Message.info(err);
                        });
            }, search(){
                var param = new URLSearchParams();
                param.append('mobile', sessionUtils.getSession("mobile"));
                param.append('token', sessionUtils.getSession("token"));
                param.append('userType', this.type);
                param.append('validStatus', this.attestationType);

                if (this.selectMobile) {
                    param.append('selectMobile', this.selectMobile + "");
                }

                this.loading = true;
                Axios.post(ipServer + "user/selectAuthAudit", param)
                        .then(res => {
                            if (res.data.code == 0) {
                                sessionUtils.setSession("token", res.data.token);
                                for (var i = 0; i < res.data.data.result.length; i++) {
                                    res.data.data.result[i].registeTime1 = sessionUtils.timestampToTime(res.data.data.result[i].registeTime);
                                    res.data.data.result[i].valildTime1 = sessionUtils.timestampToTime(res.data.data.result[i].valildTime);

                                    if (res.data.data.result[i].status == 1) {
                                        res.data.data.result[i].status1 = "启动";
                                    } else {
                                        res.data.data.result[i].status1 = "禁用";
                                    }
                                    if (res.data.data.result[i].validStatus == 0) {
                                        res.data.data.result[i].validStatus1 = "未认证";
                                    }
                                    if (res.data.data.result[i].validStatus == 1) {
                                        res.data.data.result[i].validStatus1 = "待认证";
                                    }
                                    if (res.data.data.result[i].validStatus == 2) {
                                        res.data.data.result[i].validStatus1 = "认证失败";
                                    }
                                    if (res.data.data.result[i].validStatus == 3) {
                                        res.data.data.result[i].validStatus1 = "认证成功";
                                    }
                                    if (res.data.data.result[i].cardPhoto) {
                                        var split = res.data.data.result[i].cardPhoto.split(',');
                                        res.data.data.result[i].cardPhoto1 = "http://p5thuz78a.bkt.clouddn.com/" + split[0];
                                        if (split.length > 1)
                                            res.data.data.result[i].cardPhoto2 = "http://p5thuz78a.bkt.clouddn.com/" + split[1];
                                    }

                                    if (res.data.data.result[i].driveCardPhoto) {
                                        var split = res.data.data.result[i].driveCardPhoto.split(',');
                                        res.data.data.result[i].driveCardPhoto1 = "http://p5thuz78a.bkt.clouddn.com/" + split[0];
                                        if (split.length > 1)
                                            res.data.data.result[i].driveCardPhoto2 = "http://p5thuz78a.bkt.clouddn.com/" + split[1];
                                    }
                                    if (!res.data.data.result[i].referrer) {
                                        res.data.data.result[i].referrer1 = "无";
                                    }
                                    if (res.data.data.result[i].type == "1") {
                                        res.data.data.result[i].type1 = "司机";
                                    }
                                    if (res.data.data.result[i].type == "2") {
                                        res.data.data.result[i].type1 = "配件商";
                                    }
                                    if (res.data.data.result[i].type == "3") {
                                        res.data.data.result[i].type1 = "修理";
                                    }
                                    if (res.data.data.result[i].type == "4") {
                                        res.data.data.result[i].type1 = "补胎";
                                    }
                                    if (res.data.data.result[i].type == "5") {
                                        res.data.data.result[i].type1 = "审车";
                                    }
                                    if (res.data.data.result[i].type == "6") {
                                        res.data.data.result[i].type1 = "加油";
                                    }
                                    if (res.data.data.result[i].type == "7") {
                                        res.data.data.result[i].type1 = "吊车";
                                    }
                                }
                                this.data = res.data.data.result;
                                if (this.data.length == 0)
                                    this.$Message.info("查询数据不存在!");

                                this.pageTotal = res.data.data.dataTotal;
                                this.curPage = res.data.data.curPage;
                            } else if (res.data.code == 3) {
                                sessionUtils.clear();
                                this.$Message.info(res.data.msg);
                                this.$router.push("/login");

                            } else {
                                this.$Message.info(res.data.msg);
                            }
                            this.loading = false;
                        })
                        .catch(err=> {
                            this.loading = false;
                            this.$Message.info(err);
                        });
            },
            getData(page){
                var param = new URLSearchParams();
                param.append('mobile', sessionUtils.getSession("mobile"));
                param.append('token', sessionUtils.getSession("token"));
                param.append('userType', this.type);
                param.append('validStatus', this.attestationType);
                if (page) {
                    param.append('pageId', page + "");
                }
                if (this.selectMobile) {
                    param.append('selectMobile', this.selectMobile + "");
                }

                this.loading = true;
                Axios.post(ipServer + "user/selectAuthAudit", param)
                        .then(res => {
                            if (res.data.code == 0) {
                                this.pageTotal = res.data.data.dataTotal;
                                this.curPage = res.data.data.curPage;
                                sessionUtils.setSession("token", res.data.token);
                                for (var i = 0; i < res.data.data.result.length; i++) {
                                    res.data.data.result[i].registeTime1 = sessionUtils.timestampToTime(res.data.data.result[i].registeTime);
                                    res.data.data.result[i].valildTime1 = sessionUtils.timestampToTime(res.data.data.result[i].valildTime);

                                    if (res.data.data.result[i].status == 1) {
                                        res.data.data.result[i].status1 = "启用";
                                    } else {
                                        res.data.data.result[i].status1 = "禁用";
                                    }

                                    if (res.data.data.result[i].validStatus == 0) {
                                        res.data.data.result[i].validStatus1 = "未认证";
                                    }
                                    if (res.data.data.result[i].validStatus == 1) {
                                        res.data.data.result[i].validStatus1 = "待认证";
                                    }
                                    if (res.data.data.result[i].validStatus == 2) {
                                        res.data.data.result[i].validStatus1 = "认证失败";
                                    }
                                    if (res.data.data.result[i].validStatus == 3) {
                                        res.data.data.result[i].validStatus1 = "认证成功";
                                    }

                                    if (res.data.data.result[i].cardPhoto) {
                                        var split = res.data.data.result[i].cardPhoto.split(',');
                                        res.data.data.result[i].cardPhoto1 = "http://p5thuz78a.bkt.clouddn.com/" + split[0];
                                        if (split.length > 1)
                                            res.data.data.result[i].cardPhoto2 = "http://p5thuz78a.bkt.clouddn.com/" + split[1];
                                    }

                                    if (res.data.data.result[i].driveCardPhoto) {
                                        var split = res.data.data.result[i].driveCardPhoto.split(',');
                                        res.data.data.result[i].driveCardPhoto1 = "http://p5thuz78a.bkt.clouddn.com/" + split[0];
                                        if (split.length > 1)
                                            res.data.data.result[i].driveCardPhoto2 = "http://p5thuz78a.bkt.clouddn.com/" + split[1];
                                    }

                                    if (!res.data.data.result[i].referrer) {
                                        res.data.data.result[i].referrer1 = "无";
                                    }
                                    if (res.data.data.result[i].type == "1") {
                                        res.data.data.result[i].type1 = "司机";
                                    }
                                    if (res.data.data.result[i].type == "2") {
                                        res.data.data.result[i].type1 = "配件商";
                                    }
                                    if (res.data.data.result[i].type == "3") {
                                        res.data.data.result[i].type1 = "修理";
                                    }
                                    if (res.data.data.result[i].type == "4") {
                                        res.data.data.result[i].type1 = "补胎";
                                    }
                                    if (res.data.data.result[i].type == "5") {
                                        res.data.data.result[i].type1 = "审车";
                                    }
                                    if (res.data.data.result[i].type == "6") {
                                        res.data.data.result[i].type1 = "加油";
                                    }
                                    if (res.data.data.result[i].type == "7") {
                                        res.data.data.result[i].type1 = "吊车";
                                    }
                                }

                                this.data = res.data.data.result;
                            } else if (res.data.code == 3) {
                                sessionUtils.clear();
                                this.$Message.info(res.data.msg);
                                this.$router.push("/login");

                            } else {
                                this.$Message.info(res.data.msg);
                            }
                            this.loading = false;
                        })
                        .catch(err=> {
                            this.loading = false;
                            this.$Message.info(err);
                        });
            }
        }
    }
</script>


<style scoped>
    @import "../../assets/css/loading.css";
</style>